<docs>
  ## 失业登记
</docs>
<template>
  <div class="wrap con-layout" ref="wrap">
    <my-bread title="失业登记" :goback="true"></my-bread>
    <co-form :model="data" :rules="rules" ref="form" label="失业登记">
      <co-select
        prop="syrylx"
        label="失业人员类型"
        v-model="data.syrylx"
        :list="dontCheck"
        @send="getName"
        :tit="true"
      ></co-select>
      <p class="tip" v-show="tipTxt">{{tipTxt}}</p>
      <data-picker :label="timeTxt" v-model="data.sysj"></data-picker>
      <co-select
        prop="gatsyyy"
        label="失业原因"
        v-model="data.gatsyyy"
        v-if="jbxx.zjlx=='02'"
        :list="codeTable.syry_d_gatsyyy"
      ></co-select>
      <tree-select
        prop="tssf"
        label="特殊身份"
        :place="tssfTxt"
        :items="tssfList"
        :arrData="tssf"
        v-if="tssfShow"
      ></tree-select>
      <tree-select
        prop="fwjg"
        label="服务机构"
        :place="fwjgTxt"
        :items="fwjgList"
        v-model="data.fwjg"
        :odd="true"
      ></tree-select>
      <select-json
        label="失业前在京参保地"
        prop="cbdxzqh"
        v-show="cbdShow"
        ref="cbd"
        :placeName.sync="data.cbdxzqhmc"
        :url="jsonUrl"
        :checkSelect="checkSelectShow"
        v-model="data.cbdxzqh"
      ></select-json>
      <select-json
        label="失业前在京就业地"
        prop="jydxzqh"
        v-show="jydShow"
        ref="jyd"
        :placeName.sync="data.jydxzqhmc"
        :url="jsonUrl"
        :checkSelect="checkSelectShow"
        v-model="data.jydxzqh"
      ></select-json>
    </co-form>
    <div class="next-step">
      <span class="btn btn-light" @click="PrevStep" v-if="this.slKey != 1">上一步</span>
      <span class="btn btn-primary" @click="save">提交</span>
    </div>
  </div>
</template>
<script>
import coForm from "base/form/form";
import coInput from "base/form/input";
import coSelect from "base/form/select";
import treeSelect from "base/form/treeSelect";
import treeOdd from "base/form/treeOdd";
import { validator } from "common/js/valid";
import dataPicker from "base/form/dataPicker3";
import selectJson from "base/form/selectJson";

export default {
  name: "syxxDetail",
  components: {
    coForm,
    coInput,
    coSelect,
    treeSelect,
    dataPicker,
    selectJson,
    treeOdd
  },
  data() {
    return {
      checked: false,
      cloak: false,
      checkSelectShow: true, //显示选择某级级联
      isShow: false, //弹框隐藏
      slKey: "", //session 其他业务调转至此页面
      timeTxt: "前身份终止时间", //判断失业人员类型对应的 时间选项
      tssfList: [
        { text: "享受本市居民最低生活保障待遇", id: "01" },
        { text: "持残疾证人员", id: "02" }
      ], //特殊身份
      // fwjgList: [{text:"户籍地",id:'1'},{text:"常住地",id:'2'}],//特殊身份
      fwjgList: [], //特殊身份
      jsonUrl: "", //获取json不同地址
      _dj: "", //跳转页面
      tssf: [], //特殊身份
      tssfTxt: "请选择特殊身份",
      fwjgTxt: "请选择服务机构",
      jbxx: {
        czdxzqh: "", //常住地
        hjxzqh: "" //户籍地
      }, //基本信息
      tipTxt: "", //提示文字
      cbdShow: false, //参保地显示
      jydShow: false, //就业地显示
      tssfShow: false, //特殊身份显隐
      data: {
        syrylx: "", //失业登记
        sysj: "", //失业时间
        gatsyyy: "", // 失业原因
        fwjg: "", // 服务机构
        sfdb: "", //享受本市居民最低生活保障待遇
        sfcj: "", //持残疾证人员
        cbdxzqh: "", //本次失业前在京参保地  行政区划
        cbdxzqhmc: "", //本次失业前在京参保地 名称
        jydxzqh: "", //本次失业前在京就业地 行政区划
        jydxzqhmc: "", //本次失业前在京就业地 名称
        zjlx: ""
      },
      rules: {
        syrylx: validator("2,less,失业人员类型,false"), // 失业人员类型
        gatsyyy: validator("2,less,失业原因,false"), // 失业原因
        shbzkh: validator("32,less,社会保障卡号,true"), // 社会保障卡号
        tssf: validator("4,least,特殊身份,false"), // 特殊身份
        fwjg: validator("1,less,服务机构,false"), // 服务机构
        cbdxzqh: validator("128,less,本次失业前在京参保地,true"), // 本次失业前在京参保地
        jydxzqh: validator("128,less,本次失业前在京就业地,true") // 本次失业前在京就业地
      },
      dontCheck: [], //不确定数组
      syrylxList: [], //失业人员类型获取带 id 代码表
      codeTable: {
        syry_d_gatsyyy: [], // 失业原因
        syry_d_syqsf: [] // 失业人员类型
      }
    };
  },
  watch: {
    "jbxx.zjlx": function(val) {
      //不同证件类型控制查询不同json文件
      this.jsonUrl = val == "01" ? "2" : "3";
    },
    "data.syrylx": function(val) {
      //失业人员类型
      if (this.jbxx.hjxz == "20" && val == "07") {
        this.$alert("农业户籍不能选择农转非人员!");
        this.data.syrylx = "";
        this.timeTxt = "前身份终止时间";
      }
      if (val == "01" || val == "02") {
        this.tipTxt = "解除时间为终止解除劳动关系或聘用关系的时间！";
      } else if (val == "08") {
        this.tipTxt = "个体工商户停业时间为个体工商户营业证照注销时间！";
      } else if (val == "09") {
        this.tipTxt = "停止灵活就业时间应与社会保险停止缴费时间一致！";
      } else {
        this.tipTxt = "";
      }
    },
    "data.fwjg": function(val) {
      if (val == "3") {
        this.cbdShow = true;
        this.fwjgTxt = "参保地";
      } else {
        this.cbdShow = false;
        this.data.cbdxzqh = this.data.cbdxzqhmc = "";
      }
      if (val == "4") {
        this.jydShow = true;
        this.fwjgTxt = "就业地";
      } else {
        this.jydShow = false;
        this.data.jydxzqhmc = this.data.jydxzqh = "";
      }
      if (val == "1") {
        this.fwjgTxt = "户籍地";
      } else if (val == "2") {
        this.fwjgTxt = "常住地";
      }
    },
    // 在京参保地
    "data.cbdxzqh": function(val) {
      if (this.jbxx.zjlx == "02") {
        if (val.substring(6, 9) == "000") {
          this.data.cbdxzqh = this.data.cbdxzqhmc = "";
          this.$refs.cbd.$el.childNodes[2].childNodes[0].innerText = "";
          this.$alert("请将本次失业前在京参保地请选择到街道!");
        }
      } else if (this.jbxx.zjlx == "01") {
        if (val.substring(3, 6) == "000") {
          this.data.cbdxzqh = this.data.cbdxzqhmc = "";
          this.$refs.cbd.$el.childNodes[2].childNodes[0].innerText = "";
          this.$alert("请将本次失业前在京参保地请选择到区!");
        }
      }
    },
    // 在京就业地
    "data.jydxzqh": function(val) {
      if (this.jbxx.zjlx == "02") {
        if (val.substring(3, 6) == "000") {
          this.data.jydxzqh = this.data.jydxzqhmc = "";
          this.$refs.jyd.$el.childNodes[2].childNodes[0].innerText = "";
          this.$alert("请将本次失业前在京就业地请选择到街道!");
        }
      } else if (this.jbxx.zjlx == "01") {
        if (val.substring(3, 6) == "000") {
          this.data.jydxzqh = this.data.jydxzqhmc = "";
          this.$refs.jyd.$el.childNodes[2].childNodes[0].innerText = "";
          this.$alert("请将本次失业前在京就业地请选择到区!");
        }
      }
    },
    // //户籍地，居住地判断 特殊身份显隐
    "jbxx.czdxzqh": function() {
      if (!this.fwjgList.some(item => item.id == this.data.fwjg)) {
        this.data.fwjg = "";
        this.fwjgTxt = "";
      }
    },
    //特殊身份
    tssf: function(val) {
      var arr = [];
      var ids = [];
      var id = "";
      this.tssfList.forEach(item => {
        val.includes(item.id) ? arr.push(item.text) : "";
        val.includes(item.id) ? ids.push(item.id) : "";
        this.tssfTxt = arr.join(",");
        id = ids.join(",");
      });
      val.filter(i => {
        if (i == "01") {
          return (this.data.sfdb = "1");
        } else if (i == "02") {
          return (this.data.sfcj = "1");
        } else {
          return (this.data.sfdb = this.data.sfcj = "0");
        }
      });
    }
  },
  methods: {
    //获取不同时间的显示文字
    getName(val) {
      this.timeTxt = val;
    },
    save() {
      this.$refs.form.validate(() => {
        if (this.data.sysj == "") {
          this.$refs.form.errorMsg = `${this.timeTxt}不能为空!`;
          return;
        }
        if (!this.data.fwjg) {
          this.$refs.form.errorMsg = "服务机构不能为空!";
          return;
        }
        if (this.cbdShow && !this.data.cbdxzqh) {
          this.$refs.form.errorMsg = "失业前在京参保地不能为空!";
          return;
        }
        if (this.jydShow && !this.data.jydxzqh) {
          this.$refs.form.errorMsg = "失业前在京就业地不能为空!";
          return;
        }
        this.data.sjly = "3"; //微信端保存必填
        this.$confirm("本人承诺上述信息真实有效", "提示", { check: true })
          .then(() => {
            this.POST_save();
          })
          .catch();
      });
    },
    //上一步
    PrevStep() {
      this.$loading = true;
      this.$http
        .post("/jysydj/syxxZc", this.data)
        .then(res => {
          const code = +res.returnData.executeResult;
          if (code === 1) {
            this.$router.go(-1);
          }
        })
        .finally(() => {
          this.$loading = false;
        });
    },
    /* 获取代码表 失业人员类型获取带 id 代码表*/
    GET_dab(id, cb) {
      this.$http
        .get("/jysydj/CodeOperation/getCodeData", {
          params: {
            dmbm: "syry_d_syqsf",
            xzqhdm: id
          }
        })
        .then(res => {
          const data = res.returnData;
          this.syrylxList = data.syry_d_syqsf;
          cb && cb();
        });
    },
    xzqhFn(val) {
      const hjddm = this.jbxx.hjxzqh.substr(0, 2); //户籍地
      const czddm = val.substr(0, 2); //常住地
      if (czddm != "11" && hjddm != "11") {
        this.fwjgList = [
          { text: "参保地", id: "3" },
          { text: "就业地", id: "4" }
        ]; //特殊身份
        this.dontCheck = this.syrylxList;
      } else if (czddm == "11" && hjddm != "11") {
        this.fwjgList = [{ text: "常住地", id: "2" }]; //特殊身份
        this.cbdShow = this.jydShow = false;
        this.dontCheck = this.syrylxList;
      } else if (czddm != "11" && hjddm == "11") {
        this.fwjgList = [{ text: "户籍地", id: "1" }]; //特殊身份
        this.dontCheck = this.syrylxList;
      } else {
        //都是北京
        this.dontCheck = this.codeTable.syry_d_syqsf;
        this.fwjgList = [
          { text: "户籍地", id: "1" },
          { text: "常住地", id: "2" }
        ];
      }
      if (hjddm == "11") {
        this.tssfShow = true;
      } else {
        this.tssfShow = false;
        this.data.sfdb = this.data.sfcj = "0";
      }
      if (!this.fwjgList.some(item => item.id == this.data.fwjg)) {
        this.data.fwjg = "";
        this.fwjgTxt = "";
      }
    },
    /* 获取代码表 */
    GET_codeTable() {
      const arrTableName = Object.keys(this.codeTable);
      this.$http
        .get("/jysydj/CodeOperation/getCodeData", {
          params: {
            dmbm: arrTableName.join()
          }
        })
        .then(res => {
          const data = res.returnData;
          arrTableName.forEach(item => {
            this.codeTable[item] = data[item];
          });
        });
    },
    /* 保存信息修改 */
    POST_save() {
      this.$loading = true;
      this.$http
        .post("/jysydj/syxxBc", this.data)
        .then(res => {
          const code = +res.returnData.executeResult;
          if (code === 1) {
            this.$alert({
              message: res.returnMsg || "操作成功!",
              cb: () => {
                if (this.slKey === "1") {
                  this.slKey = null;
                  window.location.href =
                    "/jycy/webapp/sybxjsl/weixin/index.html"; //线上
                  // window.location.href = "/bksxrjcsbb_ywd/sybxjsl/weixin/index.html";//测试
                } else {
                  this.$router.push({ path: "/index" });
                }
              }
            });
          } else {
            this.$alert(res.returnMsg);
          }
        })
        .finally(() => {
          this.$loading = false;
        });
    },
    /*  查询基本信息 */
    GET_getInfo() {
      this.$loading = true;
      this.$http
        .get("/jysydj/syxxCx")
        .then(res => {
          const resData = res.returnData;
          this.data = resData.syxx;
          this.jbxx = resData.jbxx;
          this.GET_dab(this.jbxx.hjxzqh, () => {
            this.xzqhFn(this.jbxx.czdxzqh);
            this.tssf.push(this.data.sfdb == "1" ? "01" : ""); //保障待遇
            this.tssf.push(this.data.sfcj == "1" ? "02" : ""); //残疾
            this.sbkSwich = this.data.shbzkh ? 1 : 0;
            //值为1，港澳台人员社会保障卡号和出生 日期和性别不能改。
            if (this.data.zjlx == "02" && this.data.wwsfbl == "1")
              this.bzkh = true;
          });
        })
        .finally(() => {
          this.$loading = false;
        });
    }
  },
  created() {
    // 获取代码表
    this.GET_codeTable();
    this.GET_getInfo();
    this._dj = this.$route.query.dj;
    this.slKey = window.location.search.split("=")[1]; //申领标识
  }
};
</script>
<style scoped lang="scss">
@import "~common/scss/var.scss";
.wrap {
  background: $color-bg;
  overflow: auto;
  .tape {
    margin-top: 20px;
  }
  .weui-cell {
    background-color: #fff;
  }

  .next-step {
    margin: 42px 0 20px 0;
    padding: 0 34px;
    .btn {
      width: 330px;
    }
    .btn-primary {
      margin-left: 10px;
    }
  }
}
.switch {
  font-size: 26px;
}
.tip {
  padding: 10px 30px;
  color: #ff9933;
  font-size: 26px;
}
</style>
